<template>
   <el-select style="width:100%" v-model="dataval" @change="selectchange" filterable clearable placeholder="请选择">
        <el-option v-for="(item,i) in list" :key="i" :label="item.key" :value="item.val"></el-option>
        <Page style="padding-left:15px;" :total="page_data.total" :background="background" :layout="layout" :page.sync="page_data.page" :limit.sync="page_data.limit" @pagination="init" />
    </el-select>
</template>
  

<script>
import Page from '@/components/common/Page.vue'
export default {
    components: {
		Page,
	},
    props: {
		url: {
			type: String,
		},
		selectval:{
			type: [Number, String],
			default:null,
		},
		is_clear:{
            type:Boolean,
            default:false
        },
	},
	watch:{
		is_clear(val){
			if(val){
				this.dataval = ''
			}
		}
	},
	data() {
		return {
			dataval:this.selectval,
			list:[],
			page_data: {
				limit: 20,
				page: 1,
				total:20,
			},
			layout:'total,sizes, prev, pager, next',
			background:false,
		}
	},
	mounted() {
		this.init()
	}, 
	methods: {
		init(){
			let param = {limit:this.page_data.limit,page:this.page_data.page}
			this.$axios.post(this.url,param).then(res => {
				if(res.data.status == 200){
					this.list = res.data.data.data
					this.page_data.total = res.data.data.total
				}
			})
		},
		selectchange(val){
			this.$emit('update:selectval',val)
		}
	}
}
</script>
  